<template>
  <div>
    生产仓储
    <!-- 添加弹出框 -->
    <el-dialog
      :title="dialogFormTitle"
      :visible.sync="dialogFormVisible"
      @close="closedialog"
    >
      <el-form
        ref="produceForm"
        :rules="rules"
        :model="productionstore"
        label-width="80px"
        style="width: 300px"
      >
        <el-form-item label="产品名称" prop="sname">
          {{ productionstore.sname }}
        </el-form-item>

        <el-form-item label="入库时间" prop="time">
          {{ productionstore.time }}
        </el-form-item>

        <el-form-item label="入库员工" prop="ename">
          <el-select
            v-model="productionstore.ename"
            filterable
            placeholder="请选择入库员工"
            clearable
          >
            <el-option
              v-for="item in employees"
              :key="item.value"
              :label="item.ename"
              :value="item.ename"
            >
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="handEditAdd">确定</el-button>
      </div>
    </el-dialog>

    <!-- 展示数据 -->
    <el-table :data="storelist" style="width: 100%">
      <el-table-column label="" width="100" align="center"> </el-table-column>
      <el-table-column prop="sname" label="物品名称" width="250" align="center">
      </el-table-column>
      <el-table-column
        prop="syield"
        label="物品数量"
        width="250"
        align="center"
      >
      </el-table-column>
      <el-table-column prop="stype" label="物品种类" width="200" align="center">
        <template slot-scope="scope">
          <el-tag
            :type="
              scope.row.stype === '成品'
                ? 'success'
                : scope.row.stype === '原料'
                ? 'primary'
                : 'danger'
            "
            disable-transitions
            >{{ scope.row.stype }}</el-tag
          >
        </template>
      </el-table-column>

      <el-table-column prop="pressure" label="库存压力" width="200" align="center">
        <template slot-scope="scope">
          <el-tag
            :type="
              scope.row.pressure === '库存正常'
                ? 'success'
                : scope.row.pressure === '需要入库'
                ? 'danger'
                : 'primary'
            "
            disable-transitions
            >{{ scope.row.pressure }}</el-tag
          >
        </template>
      </el-table-column>

      <el-table-column label="操作" align="center">
        <template slot-scope="scope">
          <el-button size="mini" @click="handAdd(scope.$index, scope.row)"
            >产品入库</el-button
          >
        </template>
      </el-table-column>

      <el-table-column label="" width="100" align="center"> </el-table-column>
    </el-table>
  </div>
</template>
  
  <script>
import axios from "axios";
export default {
  data() {
    return {
      dialogFormVisible: false,
      dialogFormTitle: "",
      storelist: [],
      productionstore: {},
      employees: [],
      productionstore: {},
      rules: {
        sname: [{ required: true, message: "请输入物品名称", trigger: "blur" }],
        time: [
          { required: true, message: "请选择入库时间", trigger: "change" },
        ],
        ename: [
          { required: true, message: "请选择入库员工", trigger: "change" },
        ],
      },
    };
  },
  mounted() {
    this.getAll();
    this.getAllEmployee();
  },
  methods: {
    //  获取当前时间
    currentDate() {
      return (
        new Date().getFullYear() +
        "-" +
        ("0" + (new Date().getMonth() + 1)).slice(-2) +
        "-" +
        ("0" + new Date().getDate()).slice(-2)
      );
    },
    //  申请入库
    handEditAdd() {
      this.$refs.produceForm.validate((valid) => {
        if (valid) {
            axios
              .post("/produced/addStore", this.productionstore)
              .then((resp) => {
                if (resp.data.code == 200) {
                  this.$message("创建成功");
                  this.getAll();
                } else {
                  this.$message.error(JSON.stringify(resp.data.msg));
                }
                this.dialogFormVisible = false;
              });
        } else {
          this.$message("验证失败");
        }
      });
    },
    // 查询所有生产员工
    getAllEmployee() {
      axios.post("/produced/findAllEmployee").then((resp) => {
        this.employees = resp.data.data;
      });
    },
    //  添加弹出框
    handAdd(index, row) {
      this.dialogFormVisible = true,
      this.dialogFormTitle = "申请入库";
      this.productionstore = { ...row };
      this.productionstore.time = this.currentDate();
    },
    //  关闭弹出框
    closedialog() {
      //  情况数据
      this.clearAllFields();
      this.$refs.produceForm.resetFields();
    },
    //  一键清空
    clearAllFields() {},
    // 查询所有信息
    getAll() {
      axios.post("/produced/findProducedStore").then((resp) => {
        if (resp.data.code == 200) {
          this.storelist = resp.data.data;
        }
      });
    },
  },
};
</script>
  <style>
</style>